import { createHashRouter } from 'react-router-dom';
import Root from '@/views/Root/Root';
import LazyComponent from '@/components/LazyComponent';
import { lazy } from 'react';
import NotFound from '@/components/NotFound';

const routes = [
  {
    path: '/',
    element: <Root />,
    children: [
      { index: true, element: <LazyComponent component={lazy(() => import('@/views/Home/index'))} /> },
      {
        path: '/home',
        element: <LazyComponent component={lazy(() => import('@/views/Home/index'))} />
      },
      {
        path: '/detail/:id',
        element: <LazyComponent component={lazy(() => import('@/views/Detail/index'))} />
      },
      {
        path: '/personal',
        element: <LazyComponent component={lazy(() => import('@/views/Personal/index'))} />
      },
      {
        path: '/login',
        element: <LazyComponent component={lazy(() => import('@/views/Login/index'))} />
      },
      {
        path: '/404',
        element: <NotFound />
      }
    ]
  }
];

const router = createHashRouter(routes);
export default router;
